<template>
    <div id="app">
        <keep-alive >
            <router-view v-if="$route.meta.keepAlive"></router-view>
        </keep-alive>
        <router-view v-if="!$route.meta.keepAlive"></router-view>
        <!-- <router-view></router-view> -->
    </div>
</template>

<script>
    export default {
        name: 'App',
        methods: {},
        beforeRouteLeave(){
            alert(1)
        }
    }
</script>

<style lang="less">
    body {
        width: 100%;
        height: 100%;
    }

    #app {
        width: 100%;
        height: 100%;
        max-width: 828px;
        margin: 0 auto;
    }

    .fade-enter-active,
    .fade-leave-active {
        transition: all .2s ease;
    }

    .fade-enter,
    .fade-leave-active {
        opacity: 0;
    }
</style>
